<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="css/style.css" media="screen" type="text/css" />
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<!--<script type="text/javascript" src="resource/js/jquery.min.js"></script>-->
		<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
		<script src="js/bootstrap.min.js"></script>

		
	</head>

	<body>
		<ul class="chat-thread">
			<li class="left">什么？你问蛋蛋的性别吗，那得等蛋蛋孵出来之后才能知道</li>
		</ul>

		<div class="formstyle">
			<form class="bs-example bs-example-form" role="form">
				<div class="input-group input-group-lg">
					<input id="shishi" type="text" class="form-control" placeholder="点击输入">
					<span id="button11" class="input-group-addon">发送</span>
				</div>
				<br>
				<!--<input type="text" style="display:none;">-->
			</form>
		</div>
		
		
		
		<script type="text/javascript">
			var sss;
			var code;
			var msg;
			$('#button11').click(function() {
				console.log("进入button");
				var shi = document.querySelector("#shishi").value;
				if(shi == "") {
					return;
				}

				$.ajax({
					type: "POST",
					url: "http://192.168.60.164:8888/bingo/chat",
					data: {
						"msg": shi,
						"apiKey": "6920335bcf7940d880fcfa427b8cfcf4"
					},
					dataType: "json",
					success: function(res) {
						console.log("进入ajax");		
						//alert(res);
						console.log(res);
						msg = res.msg;
						sss = res.data;
						code = res.code;
						var form_val = $('.form-control').val();
						$('.chat-thread').append('<li class="right">' + form_val + '</li>');
						$('.form-control').val('');
						
						if(code == 0) {
							setTimeout(
								function() {
									$('.chat-thread').append('<li class="left">' + sss + '</li>');
									$('.chat-thread').scrollTop($('.chat-thread')[0].scrollHeight);

								}, 1000);

						} else {
							setTimeout(
								function() {
									$('.chat-thread').append('<li class="left">' + msg + '</li>');
									$('.chat-thread').scrollTop($('.chat-thread')[0].scrollHeight);

								}, 1000);

						}
					}
				});

				//dandan(sss);
			});
		</script>
	</body>

</html>